﻿<template>
  <el-dialog :title = 'dialogTitle' :visible.sync = 'dialogFormVisible' width = '75%' class = 'main_dialog' @close = "closeDialog"
  :close-on-click-modal = 'false' :close-on-press-escape = 'false'>
    <div class = 'add_content clear'>
      <div class = 'add_content_left'>
        <p class = 'add_item_label'>字段名称</p>
        <div class = 'add_item_form'>
          <el-input placeholder = '请输入字段名称' v-model = 'keyStr'></el-input>
        </div>
        <!-- <p class = 'add_item_label'>字段描述</p>
        <div class = 'add_item_form'>
          <el-input placeholder = '请输入字段描述' v-model = 'keyName'></el-input>
        </div> -->
        <p class = 'add_item_label'>字段表达式</p>
        <div class = 'add_item_form'>
          <el-input placeholder = '请输入字段表达式' id = 'expressContent'
          v-model = 'keyExpress' type = 'textarea' :rows = '11'></el-input>
        </div>
      </div>
      <div class = 'add_content_right clear'>
        <div class = 'add_item left'>
          <p class = 'add_item_label'>点击引用字段</p>
          <ul class = 'add_list_cloumn'>
            <li v-for = "(item, index) in columnsList" :key = 'index' @click = 'addExpress(item.column_name)'>
              {{item.column_name + '(' + (item.data_type ? item.data_type : item.column_type) + ')'}}
            </li>
          </ul>
        </div>
        <div class = 'add_item_border'></div>
        <div class = 'add_item right'>
          <p class = 'add_item_label'>点击引用函数</p>
          <ul class = 'add_list_fun'>
            <li v-for = "(item, index) in expressList" :key = 'index' :title = 'item.desc'
             @click = 'addExpress(item.format)'>{{item.format}}</li>
          </ul>
        </div>
      </div>
    </div>
    <div class = 'add_btns'>
      <el-button type = "info" @click = "resetForm ('ruleForm')">取 消</el-button>
      <el-button type = "primary" @click = "submitForm ('ruleForm')">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script src = './addExpress.js'></script>

<style lang = "scss" src = './addExpress.scss'></style>
